<template>
	<!-- 时间轴 -->
	<view class="timeline">
		<up-navbar
		            title="赛事详情"
		            :autoBack="true"
					@click="goback"
		        >
		        </up-navbar>
	    <view class="timeline-item">
	        <strong>2025</strong>
	        <text>赛事报名</text>
	        <view class="content">
	            <text>添加更多的文本、图片、表格等内容</text>
	        </view>
	    </view>
	
	    <view class="timeline-item">
	        <strong>2025</strong>
	        <text>筹备过程</text>
	
	        <view class="content">
	            <text>添加更多的文本、图片、表格等内容</text>
	        </view>
	    </view>
	
	    <view class="timeline-item">
	        <strong>2025</strong>
	        <text>训练进展</text>
	
	        <view class="content">
	            <text>添加更多的文本、图片、表格等内容</text>
	        </view>
	    </view>
	
	    <view class="timeline-item">
	        <strong>2025</strong>
	        <text>往年成绩</text>
	
	        <view class="content">
	            <text>添加更多的文本、图片、表格等内容</text>
	        </view>
	    </view>
	</view>
</template>

<script setup>
	const goback = () => {
		uni.navigateTo({
			url:'/pages/shengsai/index'
		})
	}
</script>

<style lang="scss" scoped>
	
	/* 时间轴容器 */
	.timeline {
	    background-color: #f4f4f4;
		margin-top: 50px;
	    padding: 50px;
	    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
	    }
	
	    /* 时间轴条目 */
	.timeline-item {
	    position: relative;
	    padding-left: 20px;
	    margin-bottom: 90px;
	    }
	
	    /* 时间轴圆点 */
	.timeline-item::before {
	    content: '';
	    position: absolute;
	    left: 0;
	    top: 5px;
	    width: 10px;
	    height: 10px;
	    background-color: #007bff;
	    border-radius: 50%;
	    }
	
	    /* 时间轴连接线 */
	.timeline-item::after {
	    content: '';
	    position: absolute;
		left: 4px;
	    top: 15px;
	    width: 2px;
	    height: 230px;
	    background-color: #007bff;
	    }
	
	    /* 主要内容容器 */
	.content {
	    flex: 1;
	    padding: 20px;
	    background-color: #fff;
	    }
</style>

